<template>
    <el-date-picker
        @change="handleChangeValue"
        v-model="currentValue"
        :type="type"
        :format="format"
        :valueFormat="valueFormat"
        :placeholder="placeholder"
        :showTrigger="true"
    >
    </el-date-picker>
</template>

<script>
// import { formatDateToDateTimeYmd00000} from "../core";

import {isNullOrUndefined, safeGet} from "../../../core";

export default {
    name: "SksDate",
    props:{
        //form表单数据
        formData:[Object],
        //属性名
        propName:[String],
        type:{
            type:String,
            default: 'date'
        },
        format:[String],
        valueFormat:{
            type: String,
            default: 'yyyy-MM-dd',
        },
        placeholder:{
            type: String,
            default: '选择日期',
        },
        //如果需要设置时间为 00:00:00 或则 23:59:59
        //appendTime=" 23:59:59"  第一个字符需要加空格
        appendTime: [String],
    },
    data(){
        return {
            //任何一个为空就不会显示,而且元素不能为 null 或 undefined
            currentValue: undefined,
        }
    },
    watch:{
        formData:{
            handler(val){
                if(isNullOrUndefined(this.formData)){
                    this.currentValue=undefined
                    return
                }
                if(isNullOrUndefined(this.propName)) {
                    this.currentValue=undefined
                    return
                }
                // console.log("this.currentValue1",this.currentValue,this.formData[this.propName],this.formData)
                if(safeGet(this.formData,this.propName)!=this.currentValue){
                    this.currentValue=this.formData[this.propName]
                }
                // console.log("this.currentValue2",this.currentValue,this.formData[this.propName],this.formData)
            },
            immediate: true,
            deep: true,
        }
    },
    methods:{
        handleChangeValue(val){
            let currentValue = this.currentValue
            let newVal=currentValue
            if(!isNullOrUndefined(currentValue)&&!isNullOrUndefined(this.appendTime)){
                if(currentValue.length == 19){
                    this.currentValue=currentValue.substr(0,10)+this.appendTime
                }
            }
            currentValue = this.currentValue
            let oldVal=undefined;
            if(isNullOrUndefined(this.formData)){
                this.$emit("input", {newVal,oldVal});
                this.$emit("change", {newVal,oldVal});
                return
            }
            if(isNullOrUndefined(this.propName)) {
                this.$emit("input", {newVal,oldVal});
                this.$emit("change", {newVal,oldVal});
                return
            }
            oldVal=this.formData[this.propName];
            this.formData[this.propName]=currentValue
            if(!isNullOrUndefined(currentValue)){
                this.$emit('clearValidate',this.propName)
                //clear之后才进行调用,否则变更值无效

                // this.formRef?.clearValidate(this.propName)
                // console.log("sksRadioDict.handleChangeValue.clearValidate.11",this.formRef)
                // setTimeout(()=>{
                //     this.$emit('clearValidate',this.propName)
                //     this.formRef?.clearValidate(this.propName)
                //     console.log("sksRadioDict.handleChangeValue.clearValidate.22",this.formRef)
                // },500)
            }

            this.$emit("input", {newVal,oldVal});
            this.$emit("change", {newVal,oldVal});
        },
    },
}
</script>

<style scoped>

</style>

<!--
                <SksDate  @clearValidate="clearFormValidate"
                          format="yyyy-MM-dd HH:mm:ss"
                          valueFormat="yyyy-MM-dd HH:mm:ss"
                          :formData="form"
                          propName="shopTime"
                          type="date"
                >

                </SksDate>
-->
